<template>
  <div class="mg16 flex_start">
    <apply-left :setpData="setpData" :content="contentLeft"></apply-left>
    <div class="apply_right">
      <div class="apply_body">
        <div class="apply_title">
          <span>会后管理</span>
          <span v-if=" DataTableDia.length > 0"><svg-icon icon-class="icon22"
              style="font-size: 16px;" class="svg-icon"></svg-icon>
            下载倒记时：{{ lastDate }}天</span>
          <span v-else></span>
        </div>
        <div class="meeting_body">
          <div>
            <h4>{{ MeetingContent.title }}</h4>
            <span class="col7e8">{{ MeetingContent.StartTime }}--{{
              MeetingContent.VideoEndDate
            }}</span>
          </div>
          <div v-if="DataTableDia.length > 0">
            <el-button style="margin-right: 10px" @click="videoDialog = true">
              下载回放视频</el-button>
            <el-button type="primary" @click="govideoAdd()">
              上传回放视频</el-button>
          </div>
          <div v-else></div>
        </div>
        <div class="apply_center">
          <div>
            <span style="font-weight: bold; color: #000; padding-right: 15px;font-size: 14px;">获取会后数据</span>
            <span class="col7e8">提示：会议已结束，请于{{
              endTime
            }}前，发送报告至您的邮箱，到期后会后数据报告将无法获取</span>
          </div>

          <div>
            <span style="padding-right:15px">会后数据发送上限：<span style="color:#0c7ff2"> {{
              rootBody.sendDataCount ? rootBody.sendDataCount : 0 }}</span></span>
            <span>已发送会后数据： <span style="color:#0c7ff2">{{ rootBody.hassend ? rootBody.hassend : 0 }}</span> </span>
          </div>
          <div v-if="$route.query.isCharges">
          </div>
          <div style="color: #0c7ff2; cursor: pointer" v-else @click="sendEmail()">
            <svg-icon icon-class="Fram1e" style="font-size: 16px;" class="svg-icon"></svg-icon>
            发送至邮箱
          </div>
        </div>
        <div class="mg20_15">
          <div class="flex flex-warp flex_bt">
            <div class="flex flex-warp" style="align-items: center">
              <div class="mb16">
                <span class="pr10">关键字搜索</span>
                <el-select style="width:120px" placeholder="请选择类型" v-model="searchObj.queryType">
                  <el-option v-for="item in queryTypeList" :key="item.name" :label="item.name" :value="item.id" />
                </el-select>
                <el-input v-model="searchObj.queryValue" placeholder="可以对姓名、单位名称、分会场的名称进行检索" class="width200 mr10"
                  clearable></el-input>
              </div>
              <div class="mb16">
                <span class="pr10">所属行业</span>
                <el-select v-model="searchObj.industry" placeholder="请选择" class="width200 mr10" clearable>
                  <el-option v-for="item in industryTypeList" :key="item.name" :label="item.name" :value="item.name" />
                </el-select>
              </div>
              <div class="mb16 mr16">
                <span class="pr10">单位类型</span>
                <el-select v-model="searchObj.unitType" placeholder="请选择" class="width200" clearable @change="changeunit">
                  <el-option v-for="item in companyTypeList" :key="item.name" :label="item.name" :value="item.id" />
                </el-select>
              </div>
              <div class="mb16 mr16">
                <span class="pr10">职位</span>
                <el-select v-model="searchObj.dutyType" placeholder="请选择" class="width200" clearable>
                  <el-option v-for="item in postTypeList" :key="item.name" :label="item.name" :value="item.id" />
                </el-select>
              </div>
              <div class="mb16 mr16" v-if="$route.query.meetType == 1 || $route.query.meetType == 4">
                <span class="pr10">分会场名称</span>
                <el-select v-model="searchObj.subMid" placeholder="请选择" class="width200" clearable>
                  <el-option v-for="item in subMidList" :key="item.title" :label="item.title" :value="item.mid" />
                </el-select>
              </div>
              <div class="mb16 mr16">
                <span class="pr10">是否已发送</span>
                <el-select v-model="searchObj.hasSend" placeholder="请选择" style="width:100px" clearable>
                  <el-option v-for="item in sendData" :key="item.name" :label="item.name" :value="item.id" />
                </el-select>
              </div>
              <div class="mb20">
                <el-button @click="React">重置</el-button>
                <el-button type="primary" @click="SearchListBt">筛选</el-button>
              </div>
            </div>
            <div></div>
          </div>
        </div>
        <div class="tableBox">
          <el-table ref="multipleTable" v-loading="loading" :data="DataTable" style="width: 100%" max-height="620"
            @selection-change="handleSelectionChange" @select="itemHandleSelectionChange" @select-all="selectAll">
            <el-table-column type="selection" width="55"> </el-table-column>
            <el-table-column prop="title" label="姓名" min-width="100" align="left">
              <template slot-scope="scope">
                <div class="flex">
                  {{ scope.row.name }}
                </div>
              </template>
            </el-table-column>
            <el-table-column prop="sampleName" label="手机号" min-width="120" align="left">
              <template slot-scope="scope">
                {{ (scope.row.mobile == '' || scope.row.mobile.length < 3) ? scope.row.mobile : scope.row.mobile.substr(0, 3)
                  + "****" + scope.row.mobile.substr(7) }} </template>
            </el-table-column>
            <el-table-column v-if="$route.query.isCharges" prop="parentUsername" label="用户属性" width="100" align="left">
              <template slot-scope="scope">
                <div class="flex">
                  {{ scope.row.parentUsername != null ? '被邀请人' : '报名人' }}
                </div>
              </template>
            </el-table-column>
            <el-table-column v-if="$route.query.isCharges" prop="ispayproof" label="是否有凭证" width="100" align="left">
              <template slot-scope="scope">
                <div class="flex" v-if="scope.row.chargeid != null && scope.row.chargeid > 0">
                  {{ scope.row.ispayproof == 1 ? '是' : '否' }}
                </div>
                <div v-else>
                  否
                </div>
              </template>
            </el-table-column>
            <el-table-column v-if="$route.query.isCharges" prop="parentUsername" label="付款信息" width="100" align="left">
              <template slot-scope="scope">
                <div v-if="scope.row.chargeid != null && scope.row.chargeid > 0">
                  <el-button type="text" @click="checkPaydata(scope.row)">查看</el-button>
                </div>
                <div v-else>
                  --
                </div>
              </template>
            </el-table-column>
            <el-table-column prop="lyState" label="邮箱" min-width="180" align="left">
              <template slot-scope="scope">
                {{ scope.row.email }}
              </template>
            </el-table-column>
            <div v-if="($route.query.meetType == 1 || $route.query.meetType == 4) && $route.query.isCharges != 1">
              <el-table-column prop="subjectTitle" label="分会场" min-width="230" align="left">
              </el-table-column>
            </div>

            <el-table-column prop="3" label="所属行业" min-width="120" align="left">
              <template slot-scope="scope">
                <div>{{ scope.row.industry ? scope.row.industry : '' }}</div>
              </template>
            </el-table-column>
            <el-table-column prop="3" label="单位名称" min-width="200" align="left">
              <template slot-scope="scope">
                <div>{{ scope.row.company }}</div>
              </template>
            </el-table-column>
            <el-table-column prop="3" label="单位类型" min-width="150" align="left">
              <template slot-scope="scope">
                <div>{{ scope.row.unitType ? scope.row.unitType : '' }}</div>
              </template>
            </el-table-column>
            <el-table-column prop="3" label="职位" min-width="100" align="left">
              <template slot-scope="scope">
                <div>{{ scope.row.dutyType ? scope.row.dutyType : '' }}</div>
              </template>
            </el-table-column>
            <el-table-column prop="3" label="发送状态" min-width="80" align="left">
              <template slot-scope="scope">
                <div>{{ scope.row.hasSendData == 1 ? '已发送' : '未发送' }}</div>
              </template>
            </el-table-column>
            <el-table-column prop="3" label="分会场" min-width="120" align="left">
              <template slot-scope="scope">
                <div>{{ scope.row.subjectTitle }}</div>
              </template>
            </el-table-column>
          </el-table>
          <span class="haschouse">已勾选 {{ multipleSelection.length }}</span>
          <div class="alignRight">

            <Pagination :total="total" :page="searchObj.page" :limit="searchObj.limit" :pageSizes="pageSizes"
              @pagination="paginations" />
          </div>
        </div>
      </div>
      <!-- 发送邮箱 -->
      <el-dialog title="发送邮箱" :visible.sync="emailDia" width="550px">
        <el-dialog width="450px" :visible.sync="innerVisible" append-to-body>
          <div style=" text-align: center;font-size: 16px;color: #0c7ff2;font-weight: bold; margin-bottom: 10px;">
            3i讲堂个人信息授权与保护声明
          </div>
          <div style="
              text-align: center;
              font-size: 14px;
              color: #333;
              margin-bottom: 15px;
            ">
            个人信息授权书
          </div>
          <div style="height: 300px; overflow-y: auto">
            【特别提示】为保障您的合法权益，在接受本《个人信息授权书》（以下简称“《授权书》”）前，请您仔细阅读本《授权书》的全部内容，充分理解《授权书》所有条款内容，尤其是加粗部分。通过网络页面点击确认，即表示您同意接受本《授权书》的全部约定内容并生效。如您对本《授权书》内容及页面提示信息有疑问，请您暂停后续操作，您可以通过电话客服（010-51654077-8229）或发送邮件（netmeeting@instrument.com.cn）的方式进行咨询。
            关于个人信息的更多处理规则，请访问《仪器信息网隐私权政策》以了解更详细的情况。<br />

            北京信立方科技发展股份有限公司、【合作伙伴】：<br />

            <br />

            本人充分理解并同意，仪器信息网“3i讲堂”服务是由北京信立方科技发展股份有限公司（以下简称“信立方”）与【合作伙伴】合作为本人提供的【3i讲堂会议】服务。现本人主动报名参加此项服务，为客观、准确的向本人提供更优质的服务，就使用本人相关个人信息，本人同意并授权如下：<br />

            一、为使用仪器信息网“3i讲堂”服务，本人同意并授权信立方收集本人姓名、手机号码、电话号码、电子邮件、工作单位（工作单位性质及名称、地址）、职务、所属行业、调研问卷信息。<br />

            二、为帮助改善和提升3i讲堂的服务质量，方便信立方和合作伙伴进行运营数据分析并为我提供礼品邮寄、资料推送邮寄（含电子邮件）、电话回访、仪器采购推荐、耗材申请试用等服务，本人同意并授权信立方将收集的本人前述信息共享给【合作伙伴】，本人同意并授权信立方将收集的本人前述信息共享给【合作伙伴】。<br />

            如您因个人原因不同意信息共享，可邮件申请撤回信息共享。邮件地址：netmeeting@instrument.com.cn，邮件中注明会议名称、日期、预留手机号，信立方会在1-5个工作日内处理并回复。<br />
          </div>
        </el-dialog>
        <div class="mt15">
          <span class="label_email">请填写邮箱地址，接收名单</span>
          <span class="label_ms">多个邮箱，请用英文“逗号”进行分隔</span>
        </div>
        <div style="margin: 15px 0 5px">
          <el-input v-model="companyData.imLinkemail" class="email_input" placeholder="请填写正确的邮箱地址"></el-input>
        </div>
        <div style="color: red;line-height: 19px;font-size: 13px;">请确保您输入的电子邮件地址是正确的，<br>
          因邮箱地址输入错误可能产生的侵权责任，由贵司自行承担！</div>
        <div>
          <!-- <span
            style="cursor: pointer; color: #0c7ff2"
            @click="innerVisible = true"
            target="_blank"
            rel="noopener noreferrer"
            >《3i讲堂个人信息授权与保护声明》</span
          > -->
        </div>
        <div slot="footer" class="dialog-footer">
          <el-button @click="emailDia = false">取 消</el-button>
          <el-button type="primary" @click="sendEmailDia()">确 定</el-button>
        </div>
      </el-dialog>
      <!-- 回放视频 -->
      <el-dialog title="回放视频" :visible.sync="videoDialog">
        <el-table :data="DataTableDia" style="width: 100%;" :height="600">
          <!-- <el-table-column type="selection" width="55"> </el-table-column> -->
          <!-- <el-table-column prop="channelSessionId" label="场次ID" min-width="150" align="left" /> -->
          <el-table-column prop="startTime" label="直播开始时间" align="left" min-width="200" />

          <el-table-column prop="recordFileType" label="视频类型" min-width="100" align="left">
            <template slot-scope="scope">
              <span :class="[
                'recordFileType',
                scope.row.recordFileType == '裁剪' ||
                  scope.row.recordFileType == '手动合并'
                  ? 'typeColor1'
                  : 'typeColor2',
              ]">{{ scope.row.recordFileType }}</span>
            </template>
          </el-table-column>
          <el-table-column prop="fileName" label="视频名称" min-width="350" align="left" />
          <el-table-column prop="duration" label="视频时长" min-width="100" align="left" />
          <el-table-column prop="daysLeft" label="暂存剩余天数" min-width="120" align="left" />
          <el-table-column label="操作" align="center" width="100" fixed="right">
            <template slot-scope="scope">
              <el-button class="mr10" type="text" @click="downloadPaper(scope.row)">下载</el-button>
            </template>
          </el-table-column>
        </el-table>
      </el-dialog>
      <!-- //查看付款信息 -->
      <el-dialog title="付款信息" :visible.sync="paymessageDia" width="480px" center :close-on-click-modal="false">
        <div>
          <div>
            <h4>付款信息</h4>
            <div class="list_body">
              付款单位: {{ Paydata.payunit }}
            </div>
            <div class="list_body">
              付款银行: {{ Paydata.bankname }}
            </div>
            <div class="list_body">
              银行账户: {{ Paydata.bankcardid }}
            </div>
            <div class="list_body">
              付款金额: {{ Paydata.money }}
            </div>
            <div class="list_body flex">
              付款凭证:
              <el-image style="width: 50px;" :src="Paydata.certificateurl" :preview-src-list="srcList">
              </el-image>
            </div>
          </div>
          <div>
            <h4>开票信息</h4>
            <div class="list_body">
              发票抬头: {{ Paydata.receipttitle }}
            </div>
            <div class="list_body">
              纳税人识别号: {{ Paydata.taxidnumber }}
            </div>
            <div class="list_body">
              发送邮箱: {{ Paydata.sendemail }}
            </div>
          </div>
        </div>
        <span slot="footer" class="dialog-footer">
          <el-button type="primary" @click="paymessageDia = false">确定</el-button>
        </span>
      </el-dialog>
      <!-- 评价 -->
      <el-dialog title="评价服务" :visible.sync="appraiseDia" width="800px" center :close-on-click-modal="false">
        <div class="pd32">
          <el-form :model="appraise" :rules="rules" ref="ruleForm">
            <el-form-item prop="question1">
              <div class="dia_list">
                <div class="dia_list_title">1.您对运营人员的总体满意度如何？ <span class="col7e8">（专业性、沟通过程、服务态度等）</span></div>
                <div>
                  <el-radio-group v-model="appraise.question1">
                    <el-radio label="非常满意">非常满意</el-radio>
                    <el-radio label="比较满意">比较满意</el-radio>
                    <el-radio label="满意">满意</el-radio>
                    <el-radio label="不太满意">不太满意</el-radio>
                    <el-radio label="非常不满意">非常不满意</el-radio>
                  </el-radio-group>
                </div>
              </div>
            </el-form-item>
            <el-form-item prop="question2">
              <div class="dia_list">
                <div class="dia_list_title">2.您对本次会议的总体满意度如何？ <span class="col7e8">（会议主题、专家级别、报告内容）</span></div>
                <div>
                  <el-radio-group v-model="appraise.question2">
                    <el-radio label="非常满意">非常满意</el-radio>
                    <el-radio label="比较满意">比较满意</el-radio>
                    <el-radio label="满意">满意</el-radio>
                    <el-radio label="不太满意">不太满意</el-radio>
                    <el-radio label="非常不满意">非常不满意</el-radio>
                  </el-radio-group>
                </div>
              </div>
            </el-form-item>
            <el-form-item prop="question3">
              <div class="dia_list">
                <div class="dia_list_title">3.您对销售人员的总体满意度如何？ <span class="col7e8">（专业性、沟通过程、服务态度等）</span></div>
                <div>
                  <el-radio-group v-model="appraise.question3">
                    <el-radio label="非常满意">非常满意</el-radio>
                    <el-radio label="比较满意">比较满意</el-radio>
                    <el-radio label="满意">满意</el-radio>
                    <el-radio label="不太满意">不太满意</el-radio>
                    <el-radio label="非常不满意">非常不满意</el-radio>
                  </el-radio-group>
                </div>
              </div>
            </el-form-item>
            <el-form-item prop="question4">
              <div class="dia_list" style="border-bottom: none;">
                <div class="dia_list_title">4.您认为本次会议有哪些方面需要改进和提高？</div>
                <div>
                  <el-input type="textarea" :rows="3" placeholder="请输入内容" v-model="appraise.question4">
                  </el-input>
                </div>
              </div>
            </el-form-item>
          </el-form>
        </div>
        <span slot="footer" class="dialog-footer">
          <el-button @click="appraiseDia = false">取消</el-button>
          <el-button type="primary" @click="saveEvaluation('ruleForm')">确定</el-button>

        </span>
      </el-dialog>
    </div>
  </div>
</template>
<script>
import applyLeft from "../components/left.vue";
import stepsDemo from "../components/Steps.vue";
import indexapi from "@/api/index";
import Pagination from "@/components/Pagination/index.vue";
import { changeDateFormat4, changeDateFormat5, getMint, insertStr } from "@/utils/commin";
export default {
  components: {
    applyLeft,
    stepsDemo,
    Pagination,
  },
  data() {
    return {
      appraiseDia: false,
      rootBody: {},
      searchTop: {
        keywords: '',
        industry: '',
        unitType: '',
        dutyType: ''
      },
      appraise: {
        question1: '',
        question2: '',
        question3: '',
        question4: '',
      },
      queryTypeList: [{ name: '姓名', id: 'name' }, { name: '单位名称', id: 'company' }],
      rules: {
        question1: [
          { required: true, message: '请选择您对运营人员的总体满意度', trigger: 'change' }
        ],
        question2: [
          { required: true, message: '请选择您对本次会议的总体满意度', trigger: 'change' }
        ],
        question3: [
          { required: true, message: '请选择销售人员的总体满意度', trigger: 'change' }
        ],
        question4: [
          { required: true, message: '请输入本次会议有哪些方面需要改进和提高', trigger: 'blur' }
        ],
      },
      searchObj: {
        imshowId: "",
        limit: 100,
        page: 1,
        mid: "",
        queryType: 'name',
        queryValue: '',
        industry: '',
        unitType: '',
        dutyType: '',
        subMid: '', //分会场id
        hasSend: '',//是否已发送
      },
      sendData: [{ name: '是', id: 1 }, { name: '否', id: 0 }],
      srcList: [],
      videoDialog: false,
      companyData: {
        imLinkemail: "",
      },
      pageSizes: [100, 200, 300],
      paymessageDia: false,
      Paydata: {},
      lastDate: '',
      innerVisible: false,
      isTimeOut: false,
      emailDia: false,
      total: 0,
      loading: false,
      companyTypeList: [], //单位类型列表
      postTypeList: [], //职位类型列表
      industryTypeList: [], //行业类型列表
      endTime: "",
      DataTable: [],
      MeetingContent: {},
      setpData: {
        step: 3,
        stepExamineOneStatus: 4,
        stepExaminetwoStatus: 4,
      },
      multipleSelection: [],
      DataTableDia: [],
      subMidList: [],
      contentLeft: null
    };
  },
  watch: {
    emailDia(val) {
      if (val == false) {
        this.multipleSelection = []
        this.SearchList();
      }
    }
  },
  created() {
    if (this.$route.query.meetType == 2 || this.$route.query.meetType == 1 || this.$route.query.meetType == 4) {
      this.contentLeft = {
        title: '定制厂商会',
        content: '定制研讨会为预约审核机制，审核通过后，开启会议直播'
      }
    }
  },
  mounted() {
    this.searchObj.imshowId = this.$store.getters.imShowId;
    this.searchObj.mid = this.$route.query.mid;
    this.endTime = changeDateFormat5(changeDateFormat4(this.$route.query.time));
    var newDate = new Date().valueOf();
    var oldDate = new Date(this.endTime).valueOf();
    if (newDate > oldDate) {
      this.isTimeOut = true;
    }
    this.SearchList();
    this.getMeetingTitleInfo();
    this.getTypeList()
    this.selectUnitType()
    this.getMeetingSubList()
  },
  methods: {
    selectAll(val) {
      //  console.log(val,'33333');
      if (val.length == 0) {
        setTimeout(() => {
          for (let i = 0; i < this.multipleSelection.length; i++) {
            for (let m = 0; m < this.DataTable.length; m++) {
              if (this.multipleSelection[i].personId == this.DataTable[m].personId) {
                this.multipleSelection.splice(i, 1)
              }
            }

          }
        }, 0)

      }
    },
    getMeetingSubList() {
      let form = {
        imshowId: this.searchObj.imshowId,
        mid: this.$route.query.mid,
      }
      indexapi.selfMeting.getMeetingSubList(form).then(res => {
        this.subMidList = res.data
      })
    },
    React() {
      this.searchObj = {
        imshowId: this.$store.getters.imShowId,
        limit: 100,
        page: 1,
        mid: this.$route.query.mid,
        queryType: '',
        queryValue: '',
        industry: '',
        unitType: '',
        dutyType: '',
        subMid: '', //分会场id
        hasSend: '',//是否已发送
      }
      // console.log(334);
    },
    //获取单位类型
    selectUnitType() {
      let form = {
        parentid: 0,
        typename: "DWLX",
      };
      indexapi.video.selectUnitType(form).then((res) => {
        this.companyTypeList = res.data;
      });
    },
    changeunit(val) {
      this.searchObj.dutyType = "";
      let obj = {};
      obj = this.companyTypeList.find((item) => {
        return item.id === val;
      });
      let form = {
        parentid: obj.id,
        typename: "ZWLX",
      };
      indexapi.video.selectUnitType(form).then((res) => {
        this.postTypeList = res.data;
      });
    },
    //获取各种类型的列表
    getTypeList() {
      indexapi.support.getIndustryClassifySelectByLevel().then((res) => {
        //获取行业分类
        if (res.code == 200) {
          this.industryTypeList = res.data.data;
        }
      });
    },
    saveEvaluation(formName) {
      this.$refs[formName].validate((valid) => {
        if (valid) {
          this.appraise.imshowid = this.$store.getters.imShowId
          this.appraise.mid = this.$route.query.mid ? this.$route.query.mid : ''
          indexapi.selfMeting.AddMeetingEvaluation(this.appraise).then(res => {
            this.$message({ type: 'success', message: '评价成功！' })
            this.appraiseDia = false
            this.SearchList()
          })
        } else {
          console.log('error submit!!');
          return false;
        }
      });


    },
    govideoAdd() {
      this.$router.push({ path: '/video/videolistadd', query: { mid: this.$route.query.mid, title: this.MeetingContent.title } })
    },
    checkPaydata(item) {
      let form = {
        id: item.chargeid
      }
      indexapi.selfMeting.getChargeInfoByid(form).then(res => {
        this.Paydata = res.data
        this.srcList = []
        this.srcList.push(this.Paydata.certificateurl)
        this.paymessageDia = true
      })
    },
    downloadPaper(val) {
      window.open(val.url)
    },
    sendEmail() {
      //  console.log(this.multipleSelection);
      if (this.isTimeOut) {
        this.$message({ type: "error", message: "已到期，会后数据无法获取！" });
      } else {
        let num = 0
        this.multipleSelection.forEach(item => {
          if (item.hasSendData == 1) {
            num++
          }
        });
        if (this.multipleSelection.length == 0) {
          this.$message({ type: "error", message: "请选择数据" });

        } else if ((this.multipleSelection.length - num) > (this.rootBody.sendDataCount - this.rootBody.hassend)) {
          this.$message({ type: "error", message: "超出发送上限" });
        }
        else {
          this.emailDia = true;
        }
      }
    },
    handleSelectionChange(val) {
      // console.log(val,'row');
      // alert('1')
      val.forEach(item => {
        this.multipleSelection.push(item)
      });
      let map = new Map();
      for (let item of this.multipleSelection) {
        map.set(item.personId, item);
      }
      this.multipleSelection = [...map.values()];
      // alert('2')

    },
    itemHandleSelectionChange(selection, row) {
      setTimeout(() => {
        let selected = selection.length && selection.indexOf(row) !== -1
        // selected为false是取消选中操作
        if (!selected) {
          //切换选中状态(从取消状态改为选中状态)
          this.multipleSelection = this.multipleSelection.filter((item) => {
            return item.personId != row.personId
          })
          // console.log(this.multipleSelection, '23');
        }
      }, 0);

    },
    //获取会议标题
    getMeetingTitleInfo() {
      let form = {
        imshowId: this.$store.getters.imShowId,
        mid: this.$route.query.mid,
      };
      indexapi.selfMeting.getMeetingTitleInfo(form).then((res) => {
        this.MeetingContent = res.data;
        // this.getOfficekList();
        if (this.MeetingContent.polyvNum && this.MeetingContent.polyvNum != 0) {
          this.getOfficekList();
        }
      });
    },
    getOfficekList() {
      let form = {
        mid: this.$route.query.mid,
        polyvNum: this.MeetingContent.polyvNum,
        // mid:32694,
        // polyvNum:3905945
      };
      indexapi.video.getOfficekList(form).then((res) => {
        this.DataTableDia = res.data;
        this.DataTableDia.forEach((item) => {
          switch (item.recordFileType) {
            case "complete":
              item.recordFileType = "完整回放";
              break;
            case "part":
              item.recordFileType = "自动录制_片段";
              break;
            case "merge":
              item.recordFileType = "手动合并";
              break;
            case "clip":
              item.recordFileType = "裁剪";
              break;
              case "pptRecord":
              item.recordFileType = "三分屏视频";
              break;
            default:
              break;
          }
          item.duration = getMint(item.duration);
          item.startTime = insertStr(item.startTime, 4, "-");
          item.startTime = insertStr(item.startTime, 7, "-");
          item.startTime = insertStr(item.startTime, 10, " ");
          item.startTime = insertStr(item.startTime, 13, ":");
          item.startTime = insertStr(item.startTime, 16, ":");
        });
        this.DataTableDia.sort((a, b) => a.daysLeft - b.daysLeft)
        console.log(this.DataTableDia[0]);
        this.lastDate = this.DataTableDia[0].daysLeft
      });
    },
    sendEmailDia() {
      if (this.companyData.imLinkemail == "") {
        this.$message({ type: "error", message: "请输入邮箱！" });
        return false;
      }
      let persons = ''
      this.multipleSelection.forEach((item, index) => {
        if (index == this.multipleSelection.length - 1) {
          persons += item.personId
        } else {
          persons += item.personId + ','
        }

      });
      let form = {
        email: this.companyData.imLinkemail,
        imshowId: this.$store.getters.imShowId,
        mid: this.$route.query.mid,
        persons: persons,
      };
      indexapi.selfMeting.sendConferencePersonEmail(form).then((res) => {
        this.$message({ type: "success", message: "发送成功！" });
        this.innerVisible = false;
        this.emailDia = false;
        //判断是否已评价
        if (this.$route.query.isEvaled == 0) {
          this.appraiseDia = true
        }

      });
    },
    // 查询
    SearchListBt() {
      this.searchObj.limit = 100;
      this.searchObj.page = 1;
      this.SearchList();
    },
    SearchList() {
      this.loading = true;
      if (this.$route.query.meetType) {
        if (this.$route.query.meetType == 2||this.$route.query.meetType == 3) {
          this.smallMeet();
        } else {
          if (this.$route.query.isCharges) {
            this.chargeMeet()
          } else {
            this.bigMeet();
          }
        }
      } else {
        this.smallMeet();
      }
    },
    smallMeet() {
      indexapi.selfMeting.getSmallAfterMeetingPerson(this.searchObj).then((res) => {
        this.DataTable = res.data.pagedata.records;
        this.total = res.data.pagedata.total;
        this.rootBody = res.data;
        this.$nextTick(() => {
          this.DataTable.forEach(item => {
            this.multipleSelection.forEach(row => {
              if (item.personId == row.personId) {
                // console.log('进入对比阶段');
                this.$refs.multipleTable.toggleRowSelection(item, true);
              }
            });
          });
        })
        this.loading = false;
      });
    },
    bigMeet() {
      indexapi.selfMeting.getBigAfterMeetingPreson(this.searchObj).then((res) => {
        this.DataTable = res.data.pagedata.records;
        this.total = res.data.pagedata.total;
        this.rootBody = res.data;
        this.$nextTick(() => {
          this.DataTable.forEach(item => {
            this.multipleSelection.forEach(row => {
              if (item.personId == row.personId) {
                // console.log('进入对比阶段');
                this.$refs.multipleTable.toggleRowSelection(item, true);
              }
            });
          });
        })


        this.loading = false;
      });
    },
    chargeMeet() {
      indexapi.selfMeting.getAfterChargesMeetPerson(this.searchObj).then((res) => {
        this.DataTable = res.data.pagedata.records;
        this.total = res.data.pagedata.total;
        this.rootBody = res.data;
        this.$nextTick(() => {
          this.DataTable.forEach(item => {
            this.multipleSelection.forEach(row => {
              if (item.personId == row.personId) {
                // console.log('进入对比阶段');
                this.$refs.multipleTable.toggleRowSelection(item, true);
              }
            });
          });
        })
        this.loading = false;
      });
    },
    // 分页
    paginations(val) {
      this.searchObj.limit = val.limit;
      this.searchObj.page = val.page;
      this.SearchList();
    },
  },
};
</script>
        
<style lang="scss" scoped>
.haschouse {
  position: relative;
  top: 35px;
}

.pd32 {
  padding: 0 16px;

  .dia_list {
    padding: 10px 0 17px;
    border-bottom: 1px solid #E5EAF0;

    .dia_list_title {
      font-size: 14px;
      font-weight: 600;
      color: #202933;
      line-height: 24px;
      margin-bottom: 10px;

      span {
        color: #7E8790;
        font-weight: 200 !important;
      }
    }
  }

  // .dia_list:last-child {
  //   border: none;
  // }
}

.pr10 {
  padding-right: 10px;
}

.topButton {
  position: absolute;
  right: 20px;
  top: 16px;
}

.flex_bt {
  justify-content: space-between;
}

.mr10 {
  margin-right: 10px;
}

.icon_right {
  font-weight: 600;
  color: #0c7ff2;
  cursor: pointer;
  font-size: 18px;
}

.width120 {
  width: 120px !important;
}

.w456 {
  width: 456px !important;
}

.mg20_15 {
  margin: 20px 15px 0;
}

.table_logo {
  width: 55px;
  height: 32px;
  display: inline-block;
  padding: 2px 4px;
  border: 1px solid #f0f3f7;
  margin-right: 8px;
  object-fit: contain;
}

.btm_butn {
  padding: 23px;
  border-top: 1px solid #e5eaf0;
  margin-top: 23px;
  text-align: center;
}

.flex_start {
  display: flex;
  align-items: flex-start;
  justify-content: flex-start;
}

.apply_right {
  margin-left: 16px;
  flex-grow: 1;
  width: 50%;

  .apply_body {
    background: #fff;

    .apply_title {
      font-size: 14px;
      font-weight: 600;
      color: #202933;
      padding: 13px 16px;
      border-bottom: 1px solid #e5eaf0;
      @include flex(row, center, space-between);
    }

    .meeting_body {
      @include flex(row, center, space-between);
      padding: 15px 16px;
      margin: 16px;
      background: #f8f9fd;

      h4 {
        font-size: 16px;
        font-weight: 600;
        color: #000000;
        line-height: 16px;
        margin-bottom: 20px;
      }
    }

    .apply_center {
      @include flex(row, center, space-between);
      margin-top: 25px;
      margin-bottom: 5px;
      margin-left: 16px;
      margin-right: 16px;
      font-size: 12px;
      color: #4f5862;
    }

    .body {
      border-top: 1px solid #f0f3f7;
      padding: 20px;

      .top {
        padding: 8px 16px;
        background: #e7f2fe;
        border-radius: 4px 4px 4px 4px;
        @include flex(row, center, space-between);
        color: #4f5862;
        font-size: 12px;
      }

      .instrument-edit-ruleForm::v-deep .el-form-item__label {
        color: #202933;
      }

      .instrument-edit-ruleForm::v-deep .el-form-item {
        margin-bottom: 32px;
      }

      .instrument-edit-ruleForm::v-deep .el-form-item:last-child {
        margin-bottom: 0;
      }

      .instrument-edit-ruleForm::v-deep .formItemInner {
        margin-bottom: 0;
      }

      .instrument-edit-ruleForm::v-deep .el-form-item__content {
        line-height: 32px;
      }

      .instrumentListBox {
        // width: 1436px;
        box-shadow: inset 0px -1px 0px 1px #dde2e8;
        padding: 16px;
        background: #f5f8fc;
        margin: 0 auto;
      }

      .essentialInformation {
        // width: 1404px;
        padding-bottom: 15px;
        background: #ffffff;
        padding-top: 24px;
        padding-left: 16px;
        margin: 0 16px;
      }

      .essentialInformation_text {
        font-size: 16px;
        font-weight: bold;
        line-height: 30px;
        margin: 0;
        padding-left: 12px;
        border-left: 4px solid #0c7ff2;
        line-height: 16px;
        margin-bottom: 20px;
      }
    }
  }
}

::v-deep .el-tabs__nav-wrap::after {
  height: 1px !important;
}

::v-deep .el-dialog__header {
  background: #f5f8fc;
  text-align: left;
  font-size: 16px;
  color: #202933;
  padding: 11px 16px;
}

::v-deep .el-dialog__body {
  padding: 25px 25px 10px !important;
}

::v-deep .el-dialog__title {
  font-size: 16px;
}

::v-deep .el-form-item__label {
  text-align: left !important;
}

::v-deep .el-form-item:last-child {
  margin-bottom: 0px;
}

::v-deep .el-form-item {
  margin-bottom: 0;
}

::v-deep .el-form-item__content {
  margin-left: 0 !important;
  line-height: 20px !important;
}

::v-deep .el-form-item__error {
  top: 73%;
  left: 3px;
}</style>